<template>
  <div>
    <a-table
      :columns="columns"
      :dataSource="dataSource"
      rowKey="id"
      :pagination="false"
    >
    </a-table>
    <my-pagination :total="total" :payload="payload"></my-pagination>
  </div>
</template>

<script>
import * as Api from '@/api/userMag.js'
import MyPagination from '@/common/myPagination'
export default {
  props: {
    value: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    const { id = '', page = '1', per_page = '12' } = this.$route.query
    return {
      payload: {
        id,
        page: Number(page),
        per_page: Number(per_page)
      },
      total: 0,
      columns: [
        { title: '编号', dataIndex: 'id' },
        { title: '酒店名称', dataIndex: 'hotel' },
        { title: '宴会厅名称', dataIndex: 'hall' },
        { title: '提交时间', dataIndex: 'created_at' }
      ],
      dataSource: []
    }
  },
  mounted() {
    this.fetchList()
  },
  methods: {
    async fetchList() {
      const { collection, username, phone, phone_info } = await Api.collectList(
        this.payload
      )
      let userInfo = { username, phone, phone_info }
      this.$emit('input', userInfo)
      this.total = collection.total
      this.dataSource = collection.list
    }
  }
}
</script>

<style></style>
